<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Menu Example</title>
        <link rel="stylesheet" href="style.css">
        <link rel="preconnect" href="https://fonts.googleapis.com">
        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
        <link
            href="https://fonts.googleapis.com/css2?family=Red+Hat+Display&display=swap"
            rel="stylesheet"
        >
    </head>
    <body>

        <div class="background">
            <nav class="menu__wrapper">
                <div class="menu__bar">
                    <a
                        href="#" title="Logo" class="logo"
                    >
                        <!-- svg -->
                    </a>
                    <ul class="navigation hide">
                        <li>
                            <button>Product <!-- svg --></button>
                            <div class="dropdown">
                                <ul class="list-items-with-description">
                                    <li>
                                        <!-- actions svg -->
                                        <div class="item-title">
                                            <h3>Actions</h3>
                                            <p>Automate any workflow</p>
                                        </div>
                                    </li>
                                    <!-- li items -->
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="action-buttons">
                    <a href="#sign-in" title="Sign in" class="secondary hide">
                        Sign in
                    </a>
                    <a href="#sign-up" title="Sign up" class="primary">
                        Sign up
                    </a>
                </div>
                <button class="burger-menu"><!-- burger menu --></button>
            </nav>
        </div>


    </body>
</html>

